<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
    <div class="container">
    <h1>翻译</h1>
    <h4>中英互译</h4></div>
</header>
<main>
    <div class="container">
        <div class="top">
            <button  id="z1" class="c3" >中文</button>
            <button  id="z2" class="c4" >英文</button>
            <button class="c"  style=" background: #6c757d;" id="z3" onclick="switchLan()">↔</button>
            <button  id="z4" class="c3" >英文</button>
            <button  id="z5" class="c4" >中文</button></div>
        <div class="con">
            <textarea id="old" placeholder=""></textarea>
            <textarea id="new" placeholder="翻译 " style="background: #ddd">     </textarea>
        </div>
    </div>
    <div class="bottom">
        <div class="container">
            <a id="fx" onclick="zhToEn()" class="c1">翻译</a>
    </div></div>
</main>
<script src="js/script.js"></script>
</body>
</html>